<template>

<div>
  <el-card class="box-card">
  <div>

  <el-card class="box-card">






    <el-form ref="basicInfoForm" :model="info" label-width="100%" size="mini" >



<!--      <h1  style="color: rgb(51, 51, 51); font-size: 24px;text-align: center;" >{{ info.learningContent }}</h1>-->
      <p style=" text-align:center;font-size: 24px" >
        学习内容
      </p>
<!--      <p  style="text-align: center;" >  {{ info.createTime }}</p><br>-->
      <p  class="img-box1" v-html="info.learningContent" > </p>



<!--      <image-preview  v-for="item in conimages"  :src="item" class="imgpre" >


      </image-preview>-->







<!--      <iframe
        v-if="info.note1 != null"
        :src="'http://127.0.0.1:9900/zhxxzhadmin'+info.note1+'#toolbar=0'"
        class="ifr">
      </iframe>-->


    </el-form>



<!--    <el-form label-width="100px">
      <el-form-item style="text-align: right;margin-left:-100px;margin-top:10px;">

        <el-button @click="close()">返回</el-button>
      </el-form-item>

    </el-form>-->






  </el-card>
  </div>
    <br>
  <div>
  <el-card class="box-card">






    <el-form ref="basicInfoForm" :model="info" label-width="100%" size="mini" >



      <!--      <h1  style="color: rgb(51, 51, 51); font-size: 24px;text-align: center;" >{{ info.learningContent }}</h1>-->

      <p style=" text-align:center;font-size: 24px">
        学习心得
      </p>
      <p  class="img-box1" v-html="info.learningExperience" > </p>




      <!--      <image-preview  v-for="item in conimages"  :src="item" class="imgpre" >


            </image-preview>-->







      <!--      <iframe
              v-if="info.note1 != null"
              :src="'http://127.0.0.1:9900/zhxxzhadmin'+info.note1+'#toolbar=0'"
              class="ifr">
            </iframe>-->


    </el-form>



<!--    <el-form label-width="100px">
      <el-form-item style="text-align: right;margin-left:-100px;margin-top:10px;">

        <el-button @click="close()">返回</el-button>
      </el-form-item>

    </el-form>-->






  </el-card>
  </div><br><div>
  <el-card class="box-card">






    <el-form ref="basicInfoForm" :model="info" label-width="100%" size="mini" >



      <!--      <h1  style="color: rgb(51, 51, 51); font-size: 24px;text-align: center;" >{{ info.learningContent }}</h1>-->


      <p style=" text-align:center;font-size: 24px">
        个人笔记
      </p>
      <p  class="img-box1" v-html="info.personalNotes" > </p>


      <!--      <image-preview  v-for="item in conimages"  :src="item" class="imgpre" >


            </image-preview>-->







      <!--      <iframe
              v-if="info.note1 != null"
              :src="'http://127.0.0.1:9900/zhxxzhadmin'+info.note1+'#toolbar=0'"
              class="ifr">
            </iframe>-->


    </el-form>










  </el-card>
  </div><el-form label-width="100px">
    <el-form-item style="text-align: right;margin-left:-100px;margin-top:10px;">

      <el-button @click="close()">返回</el-button>
    </el-form-item>

  </el-form>
  </el-card></div>
</template>
<style>
.img-box1 {
  white-space: pre-wrap;
  width: 90%;

  position: center;
  margin:20px auto;
}
.img-box1 img {
  width: 70%;

  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.imgpre{
  width:200px;
  height: 100px;


}
.ifr{
  width: 70%;
  height: 700px;

  position: relative;
  left: 50%;
  transform: translateX(-50% );
}
</style>
<script>
import { listEducation, getEducation, delEducation, addEducation, updateEducation } from "@/api/module/yzx/education/education";
import watermark from "watermark-dom";

/*import {addStatisticsp,updateStatistics,upStatistics1 } from "@/api/module/yzx/cs/statistics";*/



export default {
  name: "ThoughtEdit",
  components: {

  },
  computed: {
    conimages: function () {
      let conimages = this.info.note2
      return conimages ? conimages.split(',') : []
    }
  },


  mounted() {
    // 加载水印

    const username = this.$store.state.user.nickname;
    watermark.load({ watermark_txt: username ,watermark_fontsize:'30px',   watermark_alpha:0.12,    watermark_width:300 ,  });





  },

  data() {
    return {
      // 选中选项卡的 name
      //activeName: "columnInfo",
      // 表格的高度
      tableHeight: document.documentElement.scrollHeight - 245 + "px",
      // 表信息
      tables: [],
      items: [],
      item: {
        conimages: ''
      },

      // 表列信息
      columns: [],
      // 字典信息
      dictOptions: [],
      // 菜单信息
      menus: [],

      // 表详细信息
      info: { note1:"",
        note2:""


      },

      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        title: undefined,
        operName: undefined,
        businessType: undefined,
        status: undefined
      }
    };
  },

  created() {



    // 禁用右键
    document.oncontextmenu = new Function('event.returnValue=false')
    // 禁用选择
    document.onselectstart = new Function('event.returnValue=false')






    const id = this.$route.query.id;
    if (id) {
      // 获取表详细信息

      getEducation(id).then(res => {

        this.info = res.data;
        console.log(this.info);


      });

    }
   /* /!*addStatisticsp(id).then(response => {*!/

    });*/





  },






  methods: {







    /** 关闭按钮 */
    close() {
      const id = this.$route.query.id;
      getEducation(id).then(response => {
        this.form = response.data;
        /*upStatistics1(this.form).then(response => {
        });*/
      });
      const obj = { path: "/zonghe/yzxeducation", query: { t: Date.now(), pageNum: this.$route.query.pageNum } };
      this.$tab.closeOpenPage(obj);

    },

  },

};
</script>






